<template>
	<view class="content">
		<block v-for="(item, index) in dataList" :key="index">
			<news-item class="list-item" :data="item" :type="item.thumbnail_pic_s03 ? 2 : 1" @onItemClick="onItemClick">
			</news-item>
		</block>
	</view>
</template>

<script>
	import NewsItem from '@/components/newsItem.vue'
	export default {
		components: {
			NewsItem
		},
		data() {
			return {
				title: 'Hello',
				dataList: []
			}
		},
		onReady() {
			console.log('ready');
			this.queryList()
		},
		onLoad() {
			console.log('load');
		},
		onPullDownRefresh() {
			this.dataList = [];
			this.queryList()
		},
		methods: {
			onItemClick(item) {
				console.log(item)
				if (item.is_content === '1') {
					uni.navigateTo({
						url: `/subpages/detail/detail?newsId=${item.uniquekey}`,
					})
				} else {
					console.log('该新闻没有内容')
					uni.navigateTo({
						url: `/subpages/detail/detail?newsId=${item.uniquekey}`,
					})
				}
			},
			queryList() {
				uni.request({
					method: 'GET',
					url: 'http://v.juhe.cn/toutiao/index',
					data: {
						key: '0813d396bfb64f752134f75ac231a694',
						type: 'top',
						page: 1,
						page_size: 30,
						is_filter: 1, // 只有有详情的会返回，默认0
					},
					success: (res) => {
						if (res.data.result) {
							this.dataList = res.data.result.data;
						} else {
							const data = {
								"reason": "success",
								"result": {
									"stat": "1",
									"data": [{
											"uniquekey": "db61b977d9fabd0429c6d0c671aeb30e",
											"title": "“新时代女性的自我关爱”主题沙龙暨双山街道福泰社区妇儿活动家园启动仪式举行",
											"date": "2021-03-08 13:47:00",
											"category": "头条",
											"author_name": "鲁网",
											"url": "https://mini.eastday.com/mobile/210308134708834241845.html",
											"thumbnail_pic_s": "https://dfzximg02.dftoutiao.com/news/20210308/20210308134708_d0216565f1d6fe1abdfa03efb4f3e23c_0_mwpm_03201609.png",
											"thumbnail_pic_s02": "https://dfzximg02.dftoutiao.com/news/20210308/20210308134708_d0216565f1d6fe1abdfa03efb4f3e23c_1_mwpm_03201609.png",
											"thumbnail_pic_s03": "https://dfzximg02.dftoutiao.com/news/20210308/20210308134708_d0216565f1d6fe1abdfa03efb4f3e23c_2_mwpm_03201609.png",
											"is_content": "1"
										},
										{
											"uniquekey": "7d246cbfa9000fb5ac42fb3bb934a592",
											"title": "滴滴发布女司机数据：2020年新增女性网约车司机超26万",
											"date": "2021-03-08 13:40:00",
											"category": "头条",
											"author_name": "国青年网",
											"url": "https://mini.eastday.com/mobile/210308134023641877777.html",
											"thumbnail_pic_s": "https://dfzximg02.dftoutiao.com/news/20210308/20210308134023_7a9ca0543b00332147c42e1ee4146908_0_mwpm_03201609.png",
											"thumbnail_pic_s02": "https://dfzximg02.dftoutiao.com/news/20210308/20210308134023_7a9ca0543b00332147c42e1ee4146908_1_mwpm_03201609.jpeg",
											"is_content": "1"
										},
										{
											"uniquekey": "c0611bea6eb961a57b21a0d1008bbe2e",
											"title": "点赞！东海县公安局学雷锋见行动",
											"date": "2021-03-08 13:38:00",
											"category": "头条",
											"author_name": "江南时报",
											"url": "https://mini.eastday.com/mobile/210308133849892734209.html",
											"thumbnail_pic_s": "https://dfzximg02.dftoutiao.com/news/20210308/20210308133849_b9f3d069a1ab400bf2d87fcc15793ca5_1_mwpm_03201609.png",
											"thumbnail_pic_s02": "https://dfzximg02.dftoutiao.com/news/20210308/20210308133849_b9f3d069a1ab400bf2d87fcc15793ca5_2_mwpm_03201609.png",
											"thumbnail_pic_s03": "https://dfzximg02.dftoutiao.com/news/20210308/20210308133849_b9f3d069a1ab400bf2d87fcc15793ca5_3_mwpm_03201609.png",
											"is_content": "1"
										}
									],
									"page": "1",
									"pageSize": "3"
								},
								"error_code": 0
							}
							console.log('这里加载的是本地数据，原因是：', res.data.reason)
							this.dataList = data.result.data;
						}
					},
					fail(err) {
						console.log(err)
					},
					complete() {
						uni.stopPullDownRefresh();
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		.list-item {
			// margin: 10px;
		}
	}
</style>
